<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form>
    <input type="text" name="name" onblur="doCheck()"><br>
    <span></span>
</form>
<button onclick="doSave()">保存</button>
</body>

<script>
    function doCheck() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4 && xhr.status === 200) {
                document.getElementsByTagName("span")[0].innerHTML = name + "--->" + xhr.responseText;
            }
        };
        var name = document.getElementsByTagName("input")[0].value;
        xhr.open("GET",`http://localhost:8081/selectOne?name=${name}`,true);
        xhr.send(null);
    }


    function doSave(){
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if(xhr.readyState === 4 && xhr.status === 200)
                document.getElementsByTagName("span")[0].innerHTML = name + "--->" + xhr.responseText;
        }
        var name = document.getElementsByTagName("input")[0].value;
        xhr.open("POST","http://localhost:8081/doSave",true);
        xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        xhr.send(`name=${name}`);
    }
</script>
</html>